<!DOCTYPE html>
<html lang="en">
<head>
    <title>查询空教室</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="__PUBLIC__/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="__PUBLIC__/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="__PUBLIC__/css/animate.min.css" rel="stylesheet">
    <link href="__PUBLIC__/css/style.min.css?v=4.1.0" rel="stylesheet">
    <link href="__PUBLIC__/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="__PUBLIC__/css/plugins/datapicker/datepicker3.css" rel="stylesheet">
</head>
<body>
<div class="tabs-container" style="height:100%;width:100%">
    <div class="ibox-content" >
        <div id="form">
            <div class="input-group col-md-2">
                <span class="input-group-addon"> 学年</span>
                <input type="text" class="form-control  datepicker" id="year" value="2021">
            </div>
            <div class="input-group col-md-2">
                <span class="input-group-addon"> 学期</span>
                <select class="form-control" id="term">
                    <option value="0">请选择</option>
                    <option value="1" selected>第一学期</option>
                    <option value="2">第二学期</option>
                </select>
            </div>
            <div class="input-group col-md-2">
                <span class="input-group-addon">教学楼号</span>
                <select class="form-control" id="lh">
                    <option value="">请选择</option>
                    <option v-for="building in buildingList" :value="building.JXLDM">{{building.JXLMC}}</option>
                </select>
            </div>
        </div>

        <!---自定义组件查询周数--->
        <div id="selectRange">
            <div class="input-group col-md-2">
                <table class="table table-bordered" >
                    <tbody>
                    <tr>
                        <td rowspan="2">周次</td>
                        <td v-for="i in 10" v-on:click="select(i)" :class="{'active':isSelect[i]}">{{i}}</td>
                    </tr>
                    <tr>
                        <td v-for="i in 10" v-on:click="select(i+10)" :class="{'active':isSelect[i+10]}">{{i+10}}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <!---自定义组件查询星期--->
        <div id="selectRange1">
            <div class="input-group col-md-2">
                <table class="table table-bordered" >
                    <tbody>
                    <tr>
                        <td>星期</td>
                        <td v-for="i in 7" v-on:click="select(i)" :class="{'active':isSelect[i]}">{{i}}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <!---自定义组件查询节次--->
        <div id="selectRange2">
            <div class="input-group col-md-2">
                <table class="table table-bordered" >
                    <tbody>
                    <tr class="text-center">
                        <td rowspan="2">节次</td>
                        <td colspan="4">上午</td>
                        <td colspan="4">下午</td>
                        <td colspan="4">晚上</td>
                    </tr>
                    <tr>
                        <td v-for="i in 12" v-on:click="select(i)" :class="{'active':isSelect[i]}">{{i}}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <!-- Example Events -->
        <div class="example-wrap">
            <div class="example">
                <table  id="RoomList"
                        data-height="400"
                        data-mobile-responsive="true">
                    <thead>
                    <tr>
                        <th data-field="cdmc">教室名称</th>
                        <th data-field="cdlbmc">教室类别</th>
                        <th data-field="xqmc">所在学区</th>
                        <th data-field="jxlmc">所在教学楼</th>
                        <th data-field="zws">座位数</th>

                    </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>
<!-- 全局js -->
<script src="__PUBLIC__/js/jquery.min.js?v=2.1.4"></script>
<script src="__PUBLIC__/js/bootstrap.min.js?v=3.3.6"></script>
<script src="__PUBLIC__/js/vue.js"></script>
<script src="__PUBLIC__/js/vue-resource.js"></script>
<script>

</script>
<script src="__PUBLIC__/js/plugins/datapicker/bootstrap-datepicker.js"></script>
<script src="__PUBLIC__/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="__PUBLIC__/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="__PUBLIC__/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="__PUBLIC__/js/searchClassroom.js"></script>
</body>
</html>
